<template>
  <div class="shorttime">
    <title-group icon="icon-xiayu" title="短时降雨" :right_txt="time" :borderBotton="true"></title-group>
    <div id="short-time" class="short-time"></div>
  </div>
</template>

<script>
  
  //import { getWeatherAPI } from "@/api/getWeatherAPI";
  import * as echarts from "echarts";
  import { getMinutelyWeather } from '@/api/getweatherData'
  import { HoursRain } from "@/api/apiList";
  import dayjs from "dayjs";
  import { getRecordData } from '@/api/consolidated_tables'
  import option from './shortTime-option.js'
  export default {
     
    data() {
      var linedata = [
        ["现在", 0],
        ["未来一小时", 0],
        ["未来两小时", 0]
      ];
      return {
        rain: null,
        chart: null,
        des: '', option, rainRes: {}, time:'更新时间'+ dayjs().format('YYYY-MM-DD HH:mm:ss'), str: ''
      };
    },
    methods: {
      async setRain() {
        // const { data: res } = await getWeatherAPI("", {
        //   unescape: 1,
        //   version: "v11",
        //   appid: 83986934,
        //   appsecret: "LeC4URB2",
        //   lng: 114.302953,
        //   lat: 30.585411,
        //   point: "gaode"
        // });
        // const start = dayjs().subtract(6, 'hour').format('YYYY-MM-DD HH:mm:ss')
        // const end = dayjs().format('YYYY-MM-DD HH:mm:ss')
        // const res = await getRecordData(1, 0, start, end);
        // if (res.data.code == 0) {
        //   this.rainRes = res.data.data;
        //   var listC = [];
        //   this.rainRes.map((item, index) => {
        //     for (let k in item) {
        //       if (k == 'location') { continue }
        //       if (listC[k] === undefined) {
        //         listC[k] = 0
        //       }
            
        //       listC[k] += item[k];
        //     }

        //   })
        //   var sData = [];
        //   var num = 0;
        //   for (let k in this.rainRes[0]) {
        //     if (k == 'location') { continue }
        //     sData.push(this.rainRes[0][k]);
        //     num++
        //   }
        //   this.option.series[0].data = sData;
        // }

        //this.rainRes = listC;

        // if (res.code == 200) {
        //   res.minutely.map((item, index) => {
        //     if (index < 12) {
        //       seriesData[1][1] += item.precip
        //     } else {
        //       seriesData[2][1] += item.precip
        //     }
        //   })
        //   this.option.series[0].data = seriesData;

        //   this.str = res.summary;
        //   var seriesData = [["现在", res.minutely[0]['precip']], ["未来一小时", 0], ["未来两小时", 0]];
        // }
        this.$nextTick(() => {
          this.echarts();
         //this.getPrecipitation()
        })
        // console.log(res);
      },
      echarts() {
        var myChart = echarts.init(document.getElementById("short-time"));
        this.chart = myChart;



        myChart.setOption(this.option);
      },
      async getPrecipitation() {
        var res = await getMinutelyWeather()
        if (res.result) {
          this.des = res.result.forecast_keypoint
        }
      }
    },

    mounted() {
      this.setRain();

    }
  };
</script>

<style lang="less" scoped>
.short-time{
  height: 50vw;
}
  .shorttime {
    
    background: white ;
    margin-top: 15px;
    .one {
      margin: 10px 10px;
      margin-bottom: 5px;
      font-size: 20px;
      color: #5da7d0;

      svg {
        width: 2rem;
        height: 2rem;
        margin-left: 0.6rem;
        margin-right: 0.6rem;
      }
    }

    .two {
      margin: 0px 24px;
      font-size: 14px;
    }

    .main {
      width: 100%;
      height: 12rem;
    }
  }
</style>